<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	template="/xhtml/bases/base.xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:t="http://myfaces.apache.org/tomahawk"
	xmlns:bargas="http://barganhas.com.br/barganhas">
	
	<ui:define name="bodyNavigation">
		<div id="searchNavigationBox">
			<div id="searchFilter">
			
				<!-- search text -->
				<h:panelGroup styleClass="innerSearchBox" layout="block"  rendered="#{siteBean.searchText ne null}">
					<p class="searchFilterHeader">
						<h:outputText value="#{msg.searchFilter}"/>
					</p>
					
					<h:panelGroup layout="block" styleClass="resultFoundSearchBox">
						<p>
							<h:outputText value="#{siteBean.searchText}"/>
						</p>
					</h:panelGroup>
				</h:panelGroup>
				
				<!-- categories -->
				<div class="innerSearchBox">
					<p class="searchFilterHeader">
						<h:outputText value="#{msg.categories}"/>
					</p>
					
					<h:panelGroup layout="block" styleClass="resultFoundSearchBox" rendered="#{siteBean.categoryFilter ne null}">
						<p>
							<h:outputText value="#{siteBean.categoryFilter.name}"/>
						</p>
						<h:commandLink value="x" action="#{siteBean.search}" styleClass="excludeResultFoundSearchBox" onclick="popupLoading(true);">
							<f:setPropertyActionListener target="#{siteBean.categoryFilter}" value="#{null}"/>
							<f:setPropertyActionListener target="#{siteBean.currentPage}" value="1"/>
						</h:commandLink>
					</h:panelGroup>
					
					<h:panelGroup rendered="#{siteBean.categoryFilter eq null}">
						<ul>
							<ui:repeat var="category" value="#{siteBean.listFilterCategory}">
								<li>
									<h:commandLink value="#{category.name}" action="#{siteBean.search}" onclick="popupLoading(true);">
										<f:setPropertyActionListener target="#{siteBean.categoryFilter}" value="#{category}"/>
										<f:setPropertyActionListener target="#{siteBean.currentPage}" value="1"/>
									</h:commandLink>
								</li>
							</ui:repeat>
						</ul>
					</h:panelGroup>
				</div>
				
				<!-- localization (states) -->
				<div class="innerSearchBox">
					<p class="searchFilterHeader">
						<h:outputText value="#{msg.localizationRegion}"/>
					</p>
					
					<h:panelGroup layout="block" styleClass="resultFoundSearchBox" rendered="#{siteBean.cityFilter ne null}">
						<p>
							<h:outputText value="#{siteBean.cityFilter.name} - #{siteBean.cityFilter.state.name}"/>
						</p>
						<h:commandLink value="x" action="#{siteBean.search}" styleClass="excludeResultFoundSearchBox" onclick="popupLoading(true);">
							<f:setPropertyActionListener target="#{siteBean.cityFilter}" value="#{null}"/>
							<f:setPropertyActionListener target="#{siteBean.currentPage}" value="1"/>
						</h:commandLink>
					</h:panelGroup>
					
					<h:panelGroup rendered="#{siteBean.cityFilter eq null}">
						<ul>
							<ui:repeat var="city" value="#{siteBean.listFilterCity}">
								<li>
									<h:commandLink value="#{city.name} - #{city.state.acronym}" action="#{siteBean.search}" onclick="popupLoading(true);">
										<f:setPropertyActionListener target="#{siteBean.cityFilter}" value="#{city}"/>
										<f:setPropertyActionListener target="#{siteBean.currentPage}" value="1"/>
									</h:commandLink>
								</li>
							</ui:repeat>
						</ul>
					</h:panelGroup>
				</div>
				
				<!-- range values -->
				<div class="innerSearchBox" style="border: 0;">
					<p class="searchFilterHeader">
						<h:outputText value="#{msg.rangeValues}"/>
					</p>
					
					<h:panelGrid columns="2">
						<h:outputLabel value="#{msg.msgFrom} #{msg.msgRealCurrency} " for="filterCurrencyFrom" style="font-size: 13px;"/>
						<bargas:inputCurrencyConverted id="filterCurrencyFrom" converterId="ConverterStringCurrencyReal"
							maxlength="12" value="#{siteBean.filterCurrencyFrom}" styleClass="currencyFilter" allowZero="false"/>
						
						<h:outputLabel value="#{msg.msgUpTo} #{msg.msgRealCurrency} " for="filterCurrencyUpTo" style="font-size: 13px;"/>
						<bargas:inputCurrencyConverted id="filterCurrencyUpTo" converterId="ConverterStringCurrencyReal"
							maxlength="12" value="#{siteBean.filterCurrencyUpTo}" styleClass="currencyFilter" allowZero="false"/>
						
						<h:column />
						<h:commandButton id="buttonFilterSearch"
							value="#{msg.msgFilterUp}"
							styleClass="customButton"
							action="#{siteBean.search}"
							immediate="false"
							onclick="popupLoading(true);">
							
							<f:setPropertyActionListener target="#{siteBean.currentPage}" value="1"/>
						</h:commandButton>
					</h:panelGrid>
				</div>
			</div>
			
			<div id="productsList">
				<h:panelGrid columns="3" styleClass="filterTopBar" columnClasses="filterGridOrList, filterItensPerPage, filterOrderBy">
					<!-- choose list or grid -->
					<h:panelGroup layout="block">
						<h:commandLink action="#{siteBean.search}" onclick="popupLoading(true);">
							<h:graphicImage value="/images/list.png"/>
							<f:setPropertyActionListener target="#{siteBean.listAsGrid}" value="#{false}"/>
						</h:commandLink>
						<h:commandLink action="#{siteBean.search}" onclick="popupLoading(true);">
							<h:graphicImage value="/images/grid.png"/>
							<f:setPropertyActionListener target="#{siteBean.listAsGrid}" value="#{true}"/>
						</h:commandLink>
					</h:panelGroup>
					
					<!-- total itens per page -->
					<h:panelGrid columns="2">
						<h:panelGroup>
							<h:outputLabel value="#{msg.advertisementTotalItensPerPage}: " for="totalItensPerPage"/>
							<h:commandLink id="hiddenLinkItensPerPage" style="display:none;" action="#{siteBean.search}" immediate="false" onclick="popupLoading(true);">
								<f:setPropertyActionListener target="#{siteBean.currentPage}" value="1"/>
							</h:commandLink>
						</h:panelGroup>
						
						<h:selectOneMenu id="totalItensPerPage" value="#{siteBean.totalItensPerPage}" converter="omnifaces.SelectItemsConverter">
							<f:selectItems value="#{siteBean.listItensPerPage}" />
							<f:ajax event="change" onevent="$j('#hiddenLinkItensPerPage').click()"/>
						</h:selectOneMenu>
					</h:panelGrid>
					
					<!-- order by -->
					<h:panelGroup>
						<ul>
							<li style="border: 0;"><h:outputText value="#{msg.searchOrdering}:"/></li>
							<li>
								<h:commandLink value="#{msg.searchOrderingMostRelevant}" action="#{siteBean.search}" rendered="#{siteBean.searchOrdering ne 'MOST_RELEVANT'}">
									<f:setPropertyActionListener target="#{siteBean.searchOrdering}" value="#{'MOST_RELEVANT'}"/>
								</h:commandLink>
								<h:outputText value="#{msg.searchOrderingMostRelevant}" rendered="#{siteBean.searchOrdering eq 'MOST_RELEVANT'}" style="font-weight: bold;"/>
							</li>
							<li>
								<h:commandLink value="#{msg.searchOrderingLowerPrice}" action="#{siteBean.search}" rendered="#{siteBean.searchOrdering ne 'LOWER_PRICE'}">
									<f:setPropertyActionListener target="#{siteBean.searchOrdering}" value="#{'LOWER_PRICE'}"/>
								</h:commandLink>
								<h:outputText value="#{msg.searchOrderingLowerPrice}" rendered="#{siteBean.searchOrdering eq 'LOWER_PRICE'}" style="font-weight: bold;"/>
							</li>
							<li style="border: 0;">
								<h:commandLink value="#{msg.searchOrderingHigherPrice}" action="#{siteBean.search}" rendered="#{siteBean.searchOrdering ne 'HIGHER_PRICE'}">
									<f:setPropertyActionListener target="#{siteBean.searchOrdering}" value="#{'HIGHER_PRICE'}"/>
								</h:commandLink>
								<h:outputText value="#{msg.searchOrderingHigherPrice}" rendered="#{siteBean.searchOrdering eq 'HIGHER_PRICE'}" style="font-weight: bold;"/>
							</li>
						</ul>
					</h:panelGroup>
				</h:panelGrid>
			
				<h:panelGroup rendered="#{bargas:isCollectionOk(siteBean.listResultSearch)}">
					<ul class="#{siteBean.listAsGrid ? 'unordenedSearchGalleryClearList' : 'unordenedSearchClearList'}" style="margin-left: 20px;">
						<ui:repeat value="#{siteBean.listResultSearch}" var="advertisement">
						
							<li style="#{siteBean.listAsGrid ? '' : 'position: relative;'}">
								
								<!-- image base -->
								<a href="#{request.contextPath}/xhtml/public/advertisementConsult.jsf?q=#{advertisement.id}"
									class="#{siteBean.listAsGrid ? 'imagesSearchGrid' : 'imagesSearchList'}">
									
									<h:graphicImage value="/fileserver?q=#{advertisement.sheetPicture.thumbnail.id}"/>
								</a>
								
								<!-- desc box -->
								<div class="#{siteBean.listAsGrid ? 'descGridSearchListBox' : 'descSearchListBox'}">
								
									<!-- title -->
									<a href="#{request.contextPath}/xhtml/public/advertisementConsult.jsf?q=#{advertisement.id}"
										class="descProduct-itensInList">
										
										<h:outputText value="#{bargas:truncateString(advertisement.title, 52)}"/>
									</a>
									
									<!-- description -->
									<p class="#{siteBean.listAsGrid ? 'furtherDescGrid' : 'furtherDescInLine'}">
										<h:outputText value="#{bargas:truncateString(advertisement.description, 230)}"/>
									</p>
								</div>
								
								<!-- price -->
								<p class="#{siteBean.listAsGrid ? 'priceBox' : 'searchListPriceBox'}">
									<a href="#{request.contextPath}/xhtml/public/advertisementConsult.jsf?q=#{advertisement.id}">
										<h:outputText value="#{msg.msgRealCurrency} "/>
										<h:outputText value="#{advertisement.value}">
											<f:converter converterId="ConverterDoubleCurrencyReal"/>
										</h:outputText>
									</a>
								</p>
								
								<!-- list exchange by -->
								<p class="#{siteBean.listAsGrid ? 'searchGridExchangeBox' : 'searchListExchangeBox'}">
									<h:outputText value="#{bargas:truncateString(advertisement.exchangeBy, 95)}"/>
								</p>
							</li>
						</ui:repeat>
					</ul>
				</h:panelGroup>
				<h:panelGroup layout="block" rendered="#{not bargas:isCollectionOk(siteBean.listResultSearch)}" styleClass="searchListEmpty">
					<h:outputText value="#{msg.advertisementSearchListEmpty}"/>
				</h:panelGroup>
				
				<div style="padding: 10px; position: relative; text-align: center; clear: both;">
					<ul class="searchScroller">
						<ui:repeat var="pageNumber" value="#{siteBean.listPageNumbers}">
							<li>
								<h:commandLink action="#{siteBean.search}" value="#{pageNumber}" styleClass="#{pageNumber eq siteBean.currentPage ? 'selectedPageNumber' : ''}">
									<f:setPropertyActionListener target="#{siteBean.currentPage}" value="#{pageNumber}"></f:setPropertyActionListener>
								</h:commandLink>
							</li>
						</ui:repeat>
					</ul>
				</div>
			</div>
		</div>
		
		<t:saveState value="#{siteBean.searchText}"/>
		<t:saveState value="#{siteBean.currentPage}"/>
		<t:saveState value="#{siteBean.listPageNumbers}"/>
		<t:saveState value="#{siteBean.listAsGrid}"/>
		<t:saveState value="#{siteBean.listFilterCategory}"/>
		<t:saveState value="#{siteBean.categoryFilter}"/>
		<t:saveState value="#{siteBean.listFilterCity}"/>
		<t:saveState value="#{siteBean.cityFilter}"/>
		<t:saveState value="#{siteBean.filterCurrencyFrom}"/>
		<t:saveState value="#{siteBean.filterCurrencyUpTo}"/>
		<t:saveState value="#{siteBean.searchOrdering}"/>
	</ui:define>
</ui:composition>